import { Avatar, Dropdown, Menu, message } from 'antd';
import styles from './index.scss';
import { history } from 'umi';
import { logout } from '../../../service/login';
interface MenuInfo {
    key: string;
    keyPath: string[];
    /** @deprecated This will not support in future. You should avoid to use this */
    item: React.ReactInstance;
    domEvent: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
}
export default function Index(props: any) {
    const userInfo = JSON.parse(localStorage.user || '{}');
    const dataSourceRequest = async () => {
        const response = await logout();
        if (response?.code === 200) {
            message.success(response.msg);
            localStorage.clear();
            history.push('/login');
        }
    };
    const onClick = (data: MenuInfo) => {
        if (data?.key === '/login') {
            dataSourceRequest();
        }
    };
    const menu = (
        <Menu onClick={onClick}>
            <Menu.Item key="/login">退出登录</Menu.Item>
        </Menu>
    );
    return (
        <div className={styles.header}>
            <div className={styles.left}></div>
            <div className={styles.right}>
                <span style={{ marginRight: '20px' }}>{userInfo?.name}</span>
                <Dropdown overlay={menu}>
                    {userInfo?.avatar ? (
                        <Avatar
                            src={userInfo?.avatar}
                            className={styles.user}
                        />
                    ) : (
                        <Avatar>
                            {userInfo?.name?.substring(
                                userInfo?.name.length - 2,
                                userInfo?.name.length,
                            )}
                        </Avatar>
                    )}
                </Dropdown>
            </div>
        </div>
    );
}
